<template>
	<view class="">
		<!-- 头部导航栏 -->
		<cus-navbar navbar :title="$t('index130')"></cus-navbar>
		<view class="main-padding">
			<!-- 社区列表 -->
			<view class="home-list-card flex align-center" v-for="(item,index) in list" :key="item.id">
				<image :src="item.logo" mode="aspectFill" class="img-122 flex-shrink"></image>
				<view class="flex-1 ml-20 flex align-center">
					<view class="flex-1">
						<view class="size-28 mb-10">{{item.title}}</view>
						<view class="size-32 text-bold color-main">{{item.price_min}}U-{{item.price_max}}U</view>
						<!-- 溢出收益 -->
						<view class="home-list-tag mt-10">{{$t('index6')}}{{item.rate}}%</view>
					</view>
					<view class="flex-center flex-direction">
						<!-- 立即投资 -->
						<button class="flex-shrink home-list-btn bg-main"
							@click="openHelp(index)">{{$t('index7')}}</button>
					</view>
				</view>
			</view>
		</view>
		<!-- 申请帮扶 确认申请 -->
		<cus-dialog ref="help" :title="$t('index12')" :btnTxt="$t('index13')" @confrim="submitHelp">
			<view class="dialog-cell flex align-center mt-20">
				<!-- 请输入投资金额 -->
				<input type="digit" v-model="price" :placeholder="$t('index11')" placeholder-class="dialog-place"
					class="flex-1 size-26" />
				<view class="flex-shrink ml-30 size-26">USDT</view>
			</view>
			<view class="dialog-cell flex align-center mt-20">
				<!-- 请输入申请帮扶金额 -->
				<input type="digit" v-model="help_price" :placeholder="$t('index14')"
					placeholder-class="dialog-place" class="flex-1 size-26" />
				<view class="flex-shrink ml-30 size-26">USDT</view>
			</view>
		</cus-dialog>
		<!-- 账号激活 前去激活 -->
		<cus-dialog ref="unActive" :title="$t('index15')" :btnTxt="$t('index16')" @confrim="goActive">
			<!-- 您还未激活账号，无法操作 -->
			<view class="text-center color-81 size-28">{{$t('index17')}}</view>
		</cus-dialog>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				notice: [],
				list: [],
				amount: '',
				rate: 0,
				index: 0,

				help_price: '',
				price: ''
			}
		},
		computed: {
			need_activate() {
				return this.$store.state.user.isActive != 1
			},
			total() {
				let amount = this.amount || 0
				console.log(this.amount)
				return this.$utils.bcmul(amount, this.rate)
			}
		},
		onLoad() {
			this.loadData()
		},
		onPullDownRefresh() {
			this.loadData(true)
		},
		methods: {
			loadData(refresh) {
				this.$api.post('/data/api.auth.invest/homeInfo').then(res => {
					console.log(res)
					this.banner = res.banner
					this.notice = res.notice
					this.list = res.list
					if (refresh) uni.stopPullDownRefresh()
				})
			},
			submit(index) {
				if (this.need_activate) {
					this.$refs.unActive.open()
				} else {
					this.index = 0
					this.amount = ''
					this.rate = this.list[this.index].fuel_rate*this.list[this.index].u_rate
					this.$refs.buy.open()
				}
			},
			goActive() {
				this.$refs.unActive.close()
				this.$refs.navbar.openActive()
			},
			submitInvest() {
				if (!this.amount) {
					uni.showToast({
						title: this.$t('index11'), // 请输入投资金额
						icon: "none"
					})
					return
				}
				this.$api.post('/data/api.auth.invest/investSub', {
					project_id: this.list[this.index].id,
					price: this.amount
				}).then(res => {
					uni.showToast({
						title: this.$t('index18') //投资成功
					})
					this.$refs.buy.close()
				})
			},
			openHelp(index) {
				this.price = ''
				this.help_price = ''
				this.index = index
				this.$refs.help.open()
			},
			submitHelp() {
				if (!this.price) {
					uni.showToast({
						title: this.$t('index11'), // 请输入投资金额
						icon: "none"
					})
					return
				}
				if (!this.help_price) {
					uni.showToast({
						title: this.$t('index19'), // 请输入申请帮扶金额
						icon: "none"
					})
					return
				}
				this.$api.post('/data/api.auth.invest/applyFor', {
					project_id: this.list[this.index].id,
					price: this.price,
					help_price: this.help_price
				}).then(res => {
					uni.showToast({
						title: this.$t('index20') // 申请成功
					})
					this.$refs.help.close()
				})
			}
		}
	}
</script>

<style lang="scss">
	.home-swiper {
		width: 100%;
		height: 260rpx;
		border-radius: 20rpx;
	}

	.home-notice-block {
		width: 20rpx;
		height: 80rpx;
		background-color: #6DECAB;
		border-radius: 4rpx;
	}

	.home-notice-box {
		width: 584rpx;
		height: 68rpx;
		background-color: #142121;
		position: absolute;
		left: 10rpx;
		z-index: 1;
		padding: 0 20rpx;

		.home-notice {
			width: 486rpx;
			height: 40rpx;
			font-size: 26rpx;
		}
	}

	.dialog-cell {
		padding: 30rpx;
		border-radius: 20rpx;
		background-color: #14151C;

		.dialog-place {
			color: #595960;
		}
	}
</style>